<template>
  <div class="app-container">
    <div class="filter-container">
      <span>渠道名称</span>
      <el-input
        v-model="channels.channelName"
        placeholder="渠道名称"
        style="width: 60%; margin-right: 20px"
        maxlength="20"
        class="filter-item"
      />
    </div>
    <div class="filter-container">
      <span>上级渠道</span>
      <el-select
        v-model="channels.adminId"
        placeholder="所属渠道"
        clearable
        class="filter-item"
        style="width: 60%; margin-right: 20px"
      >
        <el-option
          v-for="(item, index) in calendarTypeOptions"
          :key="index"
          :label="item.nickname"
          :value="item.id"
        />
      </el-select>
    </div>

    <div class="filter-container">
      <span>所属房间</span>
      <el-select
        v-model="channels.roomId"
        placeholder="所属房间"
        clearable
        class="filter-item"
        style="width: 60%; margin-right: 20px"
      >
        <el-option
          v-for="(item, index) in BelongingRoom_"
          :key="index"
          :label="item.name"
          :value="item.id"
        />
      </el-select>
    </div>
    <div class="filter-container">
      <span>默认主播ID</span>
      <el-input
        v-model="channels.defaultUserId"
        placeholder="输入主播ID(选填)"
        style="width: 60%; margin-right: 20px"
        maxlength="20"
        class="filter-item"
      />
    </div>
    <el-button class="filter-item" type="primary" @click="confirm">
      确认
    </el-button>
  </div>
</template>

<script>
import { encryption2 } from '@/api/index'
import Cookies from 'js-cookie'
export default {
  name: 'ComplexTable',
  data() {
    return {
      url: '',
      // 渠道
      channels: {
        channelName: '', // 渠道名称
        adminId: '', // 上级渠道
        roomId: '', // 所属房间
        defaultUserId: '' // 默认主播id
      },
      calendarTypeOptions: [
        {
          id: '',
          nickname: ''
        }
      ],
      BelongingRoom_: [
        {
          id: '',
          name: ''
        }
      ]
    }
  },
  created() {
    // console.log(this.$route.params.Code);
    if (this.$route.params.Code) {
      if (this.$route.params.Code.channel_code) {
        this.url = '/market/editChannel'
        this.calendarTypeOptions[0].id =
          this.$route.params.Code.market_admin_id
        this.calendarTypeOptions[0].nickname =
          this.$route.params.Code.adminname
        this.BelongingRoom_[0].id = this.$route.params.Code.default_room_id
        this.BelongingRoom_[0].name = this.$route.params.Code.room_name

        this.channels.channelName = this.$route.params.Code.channel_name
        this.channels.adminId = this.calendarTypeOptions[0].id
        this.channels.roomId = this.BelongingRoom_[0].id
        this.channels.defaultUserId = this.$route.params.Code.perfect_number
      } else {
        this.url = '/market/addChannel'
        // console.log('创建推荐码')
      }
    } else {
      this.url = '/market/addChannel'
      // console.log("创建推荐码");
    }
    this.Channel()
    this.BelongingRoom()
  },
  methods: {
    Channel() {
      const arys = {}
      const url = '/market/singleList'
      encryption2(arys, url).then((res) => {
        if (res.data.status === 0) {
          if (this.calendarTypeOptions.length > 1) {
            this.calendarTypeOptions = this.calendarTypeOptions.concat(
              res.data.result
            )
          } else {
            this.calendarTypeOptions = res.data.result
          }
        } else {
          console.log(res)
        }
      })
    },
    BelongingRoom() {
      const arys = {}
      const url = '/room/singleList'
      encryption2(arys, url).then((res) => {
        if (res.data.status === 0) {
          if (this.BelongingRoom_.length > 0) {
            this.BelongingRoom_ = this.BelongingRoom_.concat(res.data.result)
          } else {
            this.BelongingRoom_ = res.data.result
          }
        } else {
          console.log(res)
        }
      })
    },
    getUserbyNumber(perfectNumber) {
      const arys = {
        adminId: JSON.parse(Cookies.get('userinfo')).admin_id,
        perfectNumber: perfectNumber,
        pageNo: 1,
        pageSize: 10
      }
      const url = '/user/getUserbyNumber'
      encryption2(arys, url).then((res) => {
        if (res.data.status === 0) {
          if (res.data.result.count == 0) {
            this.$message({
              message: '用户不存在',
              type: 'error'
            })
          } else {
            this.establish(res.data.result.list[0].user_id)
          }
        } else {
          this.$message({
            message: res.data.text,
            type: 'error'
          })
        }
      })
    },
    establish(defaultUserId) {
      const url = this.url
      if (url == '/market/editChannel') {
        const arys = {
          id: this.$route.params.Code.id,
          channelName: this.channels.channelName, // 渠道名称
          adminId: this.channels.adminId, // 上级渠道
          roomId: this.channels.roomId, // 所属房间
          defaultUserId: defaultUserId || '' // 默认主播ID
        }
        encryption2(arys, url).then((res) => {
          if (res.data.status === 0) {
            this.$message({
              message: res.data.text,
              type: 'success'
            })
            this.$router.go(-1)
          } else {
            this.$message({
              message: res.data.text,
              type: 'error'
            })
          }
        })
      } else {
        const arys = {
          defaultUserId: defaultUserId || '', // 默认主播ID
          channelName: this.channels.channelName, // 渠道名称
          adminId: this.channels.adminId, // 上级渠道
          roomId: this.channels.roomId // 所属房间
        }
        encryption2(arys, url).then((res) => {
          if (res.data.status === 0) {
            this.$message({
              message: res.data.text,
              type: 'success'
            })
            this.$router.go(-1)
          } else {
            this.$message({
              message: res.data.text,
              type: 'error'
            })
          }
        })
      }
    },
    confirm() {
      if (this.channels.defaultUserId) {
        this.getUserbyNumber(this.channels.defaultUserId)
      } else {
        this.establish()
      }
    }
  }
}
</script>
<style scoped>
.filter-container {
  width: 1000px;
  display: flex;
  align-items: center;
}

.filter-container > span {
  width: 100px;
  font-size: 16px;
  font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB",
    "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
}
</style>
